<script setup lang='ts'>
import {provide, reactive} from 'vue';
  import { numberApi } from "@/api/controller";
  import { parseTime } from "@/utils/index";
  import { ElMessageBox } from "element-plus";
  import { ToastSuccess, Toastloading } from '@/utils/public';
  const $emit = defineEmits(['updateList'])
  const action = reactive({
    dialogFormVisible:false,
    title:''
  }) as any
  let forbid_user = [] as Array<number>
  const genderFilter = (gender = 0) => {
    const list = ['未知','男','女']
    return list[gender] || '未知'
  };
// provide('genderFilter',genderFilter)
  const handleCode = () => {
    ElMessageBox.confirm("确定修改用户邀请二维码激活状态吗？", "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(async () => {
        const loading = Toastloading();
        await numberApi.activateCode(action);
        loading.close();
        handleSubmit();
        ToastSuccess("操作成功!");
      })
      .catch(() => { });
  };
  const handleSubmit = ()=>{
    $emit('updateList',{
      user_id:action.user_id
    })
  }
  const openDialog = (query:any = {})=> {
    const {
      user_id=0, user_uuid='',
      nickname='', portrait='', gender='', mobile_phone='', union_name='', create_timestamp='',
      v='', wealth_balance='', rank_name='', sign_state='', sign_union_name='',
      sign_create_time='', sign_expire_time='', last_login_time='', is_open_code='', code=''
    } = query
    Object.assign(action,{
      dialogFormVisible:true,
      title:`用户：${nickname}详情`,
      user_id,user_uuid,portrait,nickname,
      gender, mobile_phone, union_name, create_timestamp,
      v, wealth_balance, rank_name, sign_state, sign_union_name,
      sign_create_time, sign_expire_time, last_login_time, is_open_code, code
    })
  }
  const closeDialog = ()=>{
    action.dialogFormVisible = false
  }
  defineExpose({
    openDialog
  })
</script>

<template>
  <div class="userinfo">
    <el-dialog
    width="60%"
    top="5vh"
    class="xm-dialog"
    v-model="action.dialogFormVisible"
    :close-on-click-modal="false"
    :show-close="false"
    :close-on-press-escape="false"
    destroy-on-close
    :title="action.title">
      <el-descriptions direction="vertical" :column="6" label-align="center" border>
        <el-descriptions-item label="ID">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="uuid">{{ action.user_uuid }}</el-descriptions-item>
        <el-descriptions-item label="昵称">{{ action.nickname }}</el-descriptions-item>
        <el-descriptions-item label="头像">
          <el-image :preview-teleported="true" style="width: 50px; height: 50px" :src="action.portrait"
            :zoom-rate="1.2" :preview-src-list="[action.portrait]" fit="cover">
            <template #error>
              <span></span>
            </template>
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="性别">{{action.gender}}</el-descriptions-item>
        <el-descriptions-item label="手机号">{{ action.mobile_phone }}</el-descriptions-item>
        <el-descriptions-item label="所属公会">{{ action.union_name }}</el-descriptions-item>
        <el-descriptions-item label="加入时间">{{ parseTime(action.create_timestamp, "{y}-{m}-{d} {h}:{i}") }}</el-descriptions-item>
        <el-descriptions-item label="状态">
          {{ forbid_user[action.user_id]? "已封号": "正常" }}
        </el-descriptions-item>
        <el-descriptions-item label="认证">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="V认证">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="财富值">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="财富等级">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="签约信息">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="登录时间">{{ action.user_id }}</el-descriptions-item>
        <el-descriptions-item label="邀请码">
          <el-button :type="action.is_open_code == 1 ? 'success' : 'primary'" @click="handleCode"><span>{{
            action.is_open_code == 1 ? action.code : "邀请码"
          }}</span></el-button>
        </el-descriptions-item>
        </el-descriptions>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="closeDialog">取 消</el-button>
          <el-button type="primary" @click="handleSubmit()">确 定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<style lang="scss" scoped >
  .userinfo{
    :deep(.el-descriptions__cell) {
      text-align: center;
      width: 200px;
    }
  }
</style>
